<!DOCTYPE html>
<!--suppress ALL-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>校园租赁-密码找回</title>
    <link rel="stylesheet" th:href="@{/assets/css/styles.css}">
    <link rel="stylesheet" th:href="@{/assets/css/colors.css}">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" crossorigin="anonymous">
    <script th:src="@{/assets/js/jquery.min.js}"></script>
    <script th:src="@{/assets/js/script.js}"></script>
</head>
<body>
    <!-- 复用首页头部 -->
    <header th:replace="index::header"></header>
    <!-- 复用提示框信息 -->
    <div th:replace="point-modal::modal"></div>
    <!-- 找回密码 -->
    <div class="container" style="margin-top: -20px;">
        <div class="main" style="margin: 0 auto; width: 85%;">
            <div class="container pl-5 pr-5 pt-3 pb-3 mt-3 mb-3">
                <h3 class="text-center text-info pb-3">找回密码</h3>
                <div class="modal-content">
                    <div class="modal-body">
                        <!-- 提交表单 -->
                        <form id="loginForm" method="post" action="#" style="margin-top: 85px; height: 455px;">
                            <div class="row">
                                <div class="col-lg-6 col-md-6" style="margin: 0 auto">
                                    <div class="form-group">
                                        <label>请输入您的电子邮箱<span id="emailUnExist" style="color: red;"></span></label>
                                        <div class="input-with-icon">
                                            <input id="email" type="email" name="email" class="form-control" placeholder="请输入邮箱号">
                                            <i class="ti-email"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div id="emailCodeDiv">
                                <div class="row">
                                    <div class="col-lg-6 col-md-6" style="margin: 0 auto">
                                        <div class="form-group">
                                            <label>验证码<span id="emailCodeCheck" style="color:red;"></span></label>
                                            <div class="row">
                                                <div class="input-with-icon col-sm-7">
                                                    <input id="emailCode" type="text" name="emailCode" class="form-control" placeholder="请输入邮箱验证码">
                                                </div>
                                                <div class="input-with-icon col-sm-4">
                                                    <button type="button" onclick="sendFindPasswordEmailCode()" class="text-white full-width btn pop-login bg-2" style="height: 36px; text-align: center; line-height: 0.1">获取验证码</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-lg-6 col-md-6" style="margin: 0 auto">
                                        <div class="form-group">
                                            <button type="button" onclick="findPassword()" class="text-white full-width btn btn-md pop-login bg-2">下一步</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div id="updatePasswordDiv" hidden="hidden">
                                <div class="row">
                                    <div class="col-lg-6 col-md-6" style="margin: 0 auto">
                                        <div class="form-group">
                                            <label>新密码<span id="passwordCheck" style="color: red;"></span></label>
                                            <div class="input-with-icon">
                                                <input id="password" type="password" name="password" class="form-control" placeholder="请输入新密码">
                                                <i></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-lg-6 col-md-6" style="margin: 0 auto">
                                        <div class="form-group">
                                            <label>确认密码<span id="confirmPasswordCheck" style="color: red;"></span></label>
                                            <div class="input-with-icon">
                                                <input id="confirmPassword" type="password" name="confirmPassword" class="form-control" placeholder="请再次确认密码">
                                                <i></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-lg-6 col-md-6" style="margin: 0 auto">
                                        <div class="form-group">
                                            <button type="button" onclick="updateForgotPassword()" class="text-white full-width btn btn-md pop-login bg-2">确认修改</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 复用首页底部 -->
    <div th:replace="index::footer"></div>
</body>
</html>